<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <link href="http://static.image.alimmdn.com/favicon.ico?t=123654" rel="shortcut icon">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="user-scalable=no">
    <title>校园美食</title>
    <link rel="stylesheet" href="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css">
    <style type="text/css">
    	body{
    		font-family:"Microsoft YaHei";
    	}
    </style>
</head>
<body style="background-color: #e9e9e9;">
<div data-role="page" style="margin: 0;" id="index" data-dom-cache＝"true">
    <div data-role="header" style="text-align: center;margin: 0;" role="banner">
        <img alt="校园美食" class="ui-grid-solo" style="width: 100%" src="http://static.image.alimmdn.com/activity/schoole_activity.png?t=1445395828053">
    </div>
    <div data-role="content" style="padding: 20px 0 145px;background-color: #e9e9e9;">
        <c:forEach items="${list}" var="ffood">
            <c:choose>
                <c:when test="${ffood.isenough eq 0}">
                    <c:choose>
                        <c:when test="${ffood.weekday eq weekday}">
                            <div style="padding: 20px 40px;margin-bottom: 20px;background-color: #ffffff;"
                                 class="ui-grid-a">
                                <div class="ui-block-a" style="padding-right: 60px;">
                                    <img alt="美食图片" src="${ffood.picPath}" style="width: 100%;height: 300px;">
                                </div>
                                <div class="ui-nodisc-icon ui-alt-icon ui-block-b">
                                    <div style="font-size: 40px;color: #000000">${ffood.name}</div>
                                    <div style="font-size: 32px;color: #39ad36;padding-top: 10px;">星期${wduper}特价</div>
                                    <input type="hidden" id="ffId" value="${ffood.fastfoodId}"/>
                                    <input type="hidden" id="price" value="${ffood.price}"/>
                                    <input type="hidden" id="discountPrice" value="${ffood.discountPrice}"/>
                                    <input type="hidden" id="${ffood.fastfoodId}Num" value="0"/>

                                    <div style="padding-top: 10px;"><s
                                            style="font-size: 26px;color: #666666;">原价${ffood.price}元</s></div>
                                    <div style="padding: 10px 0 20px 0;">
                                        <span style="font-size: 32px;color: #000000;">呼送价</span>
                                        <span style="font-size: 42px;color: #ff1212">${ffood.discountPrice}元</span>
                                    </div>
                                    <a href="javascript:void(0)" onclick="minus(${ffood.fastfoodId})"
                                       class="ui-btn ui-shadow ui-corner-all ui-icon-minus ui-btn-icon-notext ui-btn-inline"
                                       style="width: 60px;height: 60px;border-radius: 2em;"></a>
                                    <span style="width: 90px;font-size: 40px;color: #000000;vertical-align: middle;padding: 0 50px;"
                                          id="${ffood.fastfoodId}Nums">0</span>
                                    <a onclick="add(${ffood.fastfoodId})" href="javascript:void(0)"
                                       class="ui-btn ui-shadow ui-corner-all ui-icon-plus ui-btn-icon-notext ui-btn-inline"
                                       style="width: 60px;height: 60px;border-radius: 2em;"></a>
                                </div>
                            </div>
                        </c:when>
                        <c:otherwise>
                            <div style="padding: 20px 40px;margin-bottom: 20px;background-color: #ffffff;"
                                 class="ui-grid-a">
                                <div class="ui-block-a" style="padding-right: 60px;">
                                    <img alt="美食图片" src="${ffood.picPath}" style="width: 100%;height: 300px;">
                                </div>
                                <div class="ui-nodisc-icon ui-alt-icon ui-block-b">
                                    <div style="font-size: 40px;color: #000000">${ffood.name}</div>
                                    <input type="hidden" id="ffId" value="${ffood.fastfoodId}"/>
                                    <input type="hidden" id="price" value="${ffood.price}"/>
                                    <input type="hidden" id="discountPrice" value="${ffood.discountPrice}"/>
                                    <input type="hidden" id="${ffood.fastfoodId}Num" value="0"/>

                                    <div style="padding: 40px 0 70px 0;">
                                        <span style="font-size: 32px;color: #000000;">价格</span>
                                        <span style="font-size: 42px;color: #ff1212">${ffood.price}元</span>
                                    </div>
                                    <a href="javascript:void(0)" onclick="minus(${ffood.fastfoodId})"
                                       class="ui-btn ui-shadow ui-corner-all ui-icon-minus ui-btn-icon-notext ui-btn-inline"
                                       style="width: 60px;height: 60px;border-radius: 2em;"></a>
                                    <span style="width: 90px;font-size: 40px;color: #000000;vertical-align: middle;padding: 0 50px;"
                                          id="${ffood.fastfoodId}Nums">0</span>
                                    <a href="javascript:void(0)" onclick="add(${ffood.fastfoodId})"
                                       class="ui-btn ui-shadow ui-corner-all ui-icon-plus ui-btn-icon-notext ui-btn-inline"
                                       style="width: 60px;height: 60px;border-radius: 2em;"></a>
                                </div>
                            </div>
                        </c:otherwise>
                    </c:choose>
                </c:when>
                <c:otherwise>
                    <div style="padding: 20px 40px;margin-bottom: 20px;background-color: #ffffff;" class="ui-grid-a">
                        <div class="ui-block-a" style="padding-right: 60px;">
                            <img alt="美食图片" src="${ffood.picPath}" style="width: 100%;height: 300px;">
                        </div>
                        <div class="ui-nodisc-icon ui-alt-icon ui-block-b">
                            <div style="font-size: 40px;color: #000000">${ffood.name}</div>
                            <div style="padding: 40px 0 70px 0;">
                                <span style="font-size: 32px;color: #000000;">价格</span>
                                <span style="font-size: 42px;color: #ff1212">${ffood.price}元</span>
                            </div>
                            <div style="font-size: 38px;color: #666666;">已抢光</div>
                        </div>
                    </div>
                </c:otherwise>
            </c:choose>
        </c:forEach>
        <div style="text-align: center;margin: 0 0 20px;">
            <img alt="配送范围" class="ui-grid-solo" style="width: 100%"
                 src="http://static.image.alimmdn.com/activity/map.png?t=1445491170545">
        </div>
    </div>
    <div class="ui-grid-solo" style="position:fixed;z-index:9999; height:145px;bottom:0px;width: 100%;">
        <div class="ui-block-a"
             style="height: 150px;line-height: 150px;padding: 0 0 0 40px;;vertical-align: middle;background-color: #ffffff;">
            <div style="float:left;">
                <span style="font-size: 32px;color: #000000;">共</span>
                <span style="font-size: 40px;color: #ff1212;padding: 0 19px 0 20px;" id="totalNums">0</span>
                <span style="font-size: 32px;color: #000000;margin-right: 40px;">份</span>
            </div>
            <div id="discountAndHSPrice"
                 style="float:left; width: auto;height: 150px;padding-right: 30px;display: none;">
                <s style="height: 10px;line-height: 100px;font-size: 22px;color: #666666;display: block;">原价<span
                        id="totalPrice">0</span>元</s>
                <span style="font-size: 32px;color: #000000;">呼送价</span>
            </div>
            <span id="onlyprice" style="font-size: 32px;color: #000000;padding-right: 30px;">呼送价</span>
            <span style="font-size: 42px;color: #ff1212;"><span id="hsPrice">0</span>元</span>
            <a href='javascript:void(0)' data-ajax="false" onclick="duSubmit()" role="button" data-transition="slidedown"
               data-close-btn="right">
                <span style="font-size: 50px;color: #ffffff;background-color: #39ad36;float: right;width: 300px;text-align: center;">下呼单</span>
            </a>
        </div>
    </div>
</div>

<div data-role="popup" id="popupBasic" data-dismissible="false" class="ui-corner-all ui-content" style="background-color: #EEEEEE;min-width: 600px;padding: 20px;">
	<!-- <a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a> -->
	<h2 style="text-align:center;padding: 10px 0 0;font-size: 60px;">提示</h2>
    <p id="message" style="text-align:center;font-size: 42px;padding: 10px 0;"></p>
    <!-- <div style="text-align: center;background-color: #39ad36;height: 100px;"></div> -->
    <a href="javascript:closePop()"  style="font-size: 45px;line-height: 35px;margin: 0;border-style:none;color:white;background-color: #39ad36;" class="ui-btn">确定</a>
</div>

<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script src='<c:url value="/Js/jsMap.js"/>'></script>
<script type="text/javascript">
$.mobile.buttonMarkup.hoverDelay = "false";
function closePop(){
	$("#popupBasic").popup('close');
}
	$("#popupBasic").popup();
    var countPric = 0;
    var countDiscountPric=0;
    var data = ${data};
    var weekday = ${weekday};
    var isDiscount = 0;
    var map = new Map();
    var foodsMap = new Map();
    var userId = ${userId};
    var advertId = ${advertId};
    var isUsedDiscount=${isUsedDiscount};
    $(function () {
        console.log("start loop");
        for (var i = 0; i < data.length; i++) {
            foodsMap.put(data[i].fastfoodId, data[i]);
        }
        console.log("end loop");
        $("#description").height(150);
    });

    function add(ffid) {
        var num = $("#" + ffid + "Num").val();
        var nums = $("#" + ffid + "Nums").html();
        var totalNums = $("#totalNums").html();
        if (num) {
            $("#" + ffid + "Num").val(parseInt(num) + 1);
        }
        if (nums) {
            $("#" + ffid + "Nums").html(parseInt(nums) + 1);
        }
        if (totalNums) {
            $("#totalNums").html(parseInt(totalNums) + 1);
        }
        var count = map.get(ffid);
        console.log("count:" + count);
        if (count) {
            map.put(ffid, count + 1);
        } else {
            map.put(ffid, 1);
        }
        console.log("count:" + map.get(ffid));
        addAmount(ffid);
    }

    function minus(ffid) {
        var count = map.get(ffid);
        console.log("count:" + map.get(ffid));
        if (count) {
            var num = $("#" + ffid + "Num").val();
            var nums = $("#" + ffid + "Nums").html();
            var totalNums = $("#totalNums").html();
            if (num) {
                if (num > 0) {
                    $("#" + ffid + "Num").val(parseInt(num) - 1);
                }
            }
            if (nums) {
                if (nums > 0) {
                    $("#" + ffid + "Nums").html(parseInt(nums) - 1);
                }
            }
            if (totalNums) {
                if (totalNums > 0) {
                    $("#totalNums").html(parseInt(totalNums) - 1);
                }
            }
            minusAmount(ffid);
        }
    }

    var totalPrice = 0;
    var totalDiscountPrice = 0;

    function addAmount(ffid) {
        var food = foodsMap.get(ffid);
        totalPrice += food.price;
        if (food.weekday == weekday) {
            if(isDiscount>=1){
            	totalDiscountPrice += food.price;
            }else{
            	if(isUsedDiscount==0){
	            	totalDiscountPrice += food.discountPrice;
	                $("#discountAndHSPrice").show();
	                $("#onlyprice").hide();
            	}else{
            		totalDiscountPrice += food.price;
            	}
            }
            isDiscount += 1;
        } else {
            totalDiscountPrice += food.price;
        }
        $("#totalPrice").html(totalPrice);
        $("#hsPrice").html(totalDiscountPrice);
    }

    function minusAmount(ffid) {
        var food = foodsMap.get(ffid);
        if (food.weekday == weekday) {
        	if(isDiscount>1){
        		if (totalDiscountPrice >= food.price) {
	                totalDiscountPrice -= food.price;
	            }
        	}else{
	            if (totalDiscountPrice >= food.discountPrice) {
	            	if(isUsedDiscount==1){
		                totalDiscountPrice -= food.price;
	            	}else{
		                totalDiscountPrice -= food.discountPrice;
	            	}
	            }
        	}
        } else {
            if (totalDiscountPrice >= food.discountPrice) {
                totalDiscountPrice -= food.price;
            }
        }
        if (totalPrice >= food.price) {
            totalPrice -= food.price;
        }

        $("#totalPrice").html(totalPrice);
        $("#hsPrice").html(totalDiscountPrice);
        if (isDiscount > 0 && food.weekday == weekday) {
            isDiscount -= 1;
        }
        if (isDiscount == 0) {
            console.log("没有折扣");
            $("#discountAndHSPrice").hide();
            $("#onlyprice").show();
        } else {
        	if(isUsedDiscount==1){
	            $("#discountAndHSPrice").hide();
	            $("#onlyprice").show();
        	}else{
	            $("#discountAndHSPrice").show();
	            $("#onlyprice").hide();
        	}
        }
        var count = map.get(ffid);
        if (count) {
            if (count > 1) {
                map.put(ffid, count - 1);
            } else {
                map.put(ffid, 0);
                map.remove(ffid);
            }
        } else {
            map.put(ffid, 0);
            map.remove(ffid);
        }
    }

    function duSubmit() {
        var orderDes = "呼送代购南大校园美食：";
        var address = "购餐地址：南京大学（鼓楼校区）南芳园餐厅食堂。";
        var arr = map.arr;
        var arrNumAndPric = new Map();
        if (arr.length > 0) {
            for (var i = 0; i < arr.length; i++) {
                var key = arr[i].key;
                var value = arr[i].value;
                var food = foodsMap.get(key);
                if (food.weekday == weekday) {
                    orderDes += food.name + "," + value + "份，原价" + food.price + "元/份,呼送特价" + food.discountPrice + "/份。";
                    countPric += value * food.discountPrice;
                    countDiscountPric += value * food.price;
                } else {
                    orderDes += food.name + "," + value + "份，价格" + food.price + "元/份。";
                    countPric += value * food.price;
                    countDiscountPric += value * food.price;
                }
            }
            orderDes += address;
            $("#description").val(orderDes);
            $("#ffMap").val(JSON.stringify(arr));
            var url = '<c:url value="/activity/toMakeOrder"/>';
            var url1 = '<c:url value="/activity/makeOrder"/>?userId=' + userId;
            var params = {
                'description': orderDes,
                'maps': JSON.stringify(arr),
                'userId': userId,
                'advertId': advertId,
                'countPric':countPric,
                'countDiscountPric':countDiscountPric
            }
            $.post(url, params, function (data) {
                if (data.code == 0) {
                	arr.length=0;
                    window.location.href = url1;
                }else{
                	$("#message").html(data.message);
        			$("#popupBasic").popup('open');
                }
            }, "json");
        }
        else {
        	$("#message").html('请选择商品');
			$("#popupBasic").popup('open');
        }
    }
</script>
</body>
</html>